<template>
  <el-form ref="form" :model="form" label-width="80px">
    <el-row>
      <el-col :span="12">
        <el-form-item label="是否收费">
          <el-switch
              v-model="is_free"
              @change="openSwitch('is_free', is_free)"
          ></el-switch>
        </el-form-item>
      </el-col>
      <el-col :span="12">
        <el-form-item label="早鸟价">
          <el-switch
              v-model="is_early_bird"
              @change="openSwitch('is_early_bird', is_early_bird)"
          ></el-switch>
        </el-form-item>
      </el-col>
    </el-row>
    <el-row>
      <el-col :span="12">
        <el-form-item label="是否住宿">
          <el-switch
              v-model="is_stay"
              @change="openSwitch('is_stay', is_stay)"
          ></el-switch>
        </el-form-item>
      </el-col>
      <el-col :span="12">
        <el-form-item label="填写发票">
          <el-switch
              v-model="is_invoice"
              @change="openSwitch('is_invoice', is_invoice)"
          ></el-switch>
        </el-form-item>
      </el-col>
    </el-row>

    <el-row>
      <el-col :span="12">
        <el-form-item label="关联会议">
          <el-switch
              v-model="is_associated_meeting"
              @change="openSwitch('is_associated_meeting', is_associated_meeting)"
          ></el-switch>
        </el-form-item>
      </el-col>
      <el-col :span="12">
        <el-form-item label="报名人数">
          <el-switch
              v-model="signup_num"
              @change="openSwitch('signup_num', signup_num)"
          ></el-switch>
        </el-form-item>
      </el-col>
    </el-row>
  </el-form>
</template>

<script>
export default {
  name: "switchForm",
  props: ['formData'],
  data() {
    return {
      form: {},
      is_free: false,//是否收费
      is_early_bird: false,//早鸟价
      is_stay: false,//是否住宿
      is_invoice: false,//是否填写发票信息
      is_associated_meeting: false,//是否关联会议
      signup_num: false, //报名人数
      is_config: false, //活动配置
    }
  },
  methods: {
    openSwitch(name, value) {
      let formData = this.formData;

      switch (name) {
        case "is_free":
          if (value == true) {
            let obj = {};
            obj.id = 1;
            obj.label = "收费方式";
            obj.name = "is_free";
            obj.type = "component";
            obj.value = true;
            obj.icon = "";
            obj.is_commonly = "";
            obj.placeholder = "";
            obj.is_disabled = true;
            obj.is_required = false;
            obj.placeholder = "";
            obj.config_value = "";
            obj.data = ["线上", "线下", "线上线下都可"];
            let arr = [];
            for (let i = 0; i < obj.data.length; i++) {
              arr.push({ name: obj.data[i] });
            }
            obj.radioData = arr;
            this.formData.push(obj); //新增收费方式单选
          } else {
            let str = this.formData.find(item => {
              return item.name == "is_early_bird";
            });
            if (str !== undefined) {
              //如果已经选中早鸟价，关掉收费 则早鸟价一并关闭
              this.formData.forEach((items, indexs) => {
                if (str.name == items.name) {
                  this.formData.splice(indexs, 1);
                  this.is_early_bird = false;
                }
              });
              formData.some((item, index) => {
                if (item.name == "is_free" && value == false) {
                  this.formData.splice(index, 1);
                }
              });
            } else {
              formData.some((item, index) => {
                if (item.name == "is_free" && value == false) {
                  this.formData.splice(index, 1);
                }
              });
            }
          }
          break;
        case "is_early_bird"://早鸟价
          console.log(this.formData)
          var switch_brid = false
          formData.some(item => {
            if (item.name == 'is_free') {
              if (item.config_value == '线上线下都可' || item.config_value == '线上') {
                switch_brid = true
              }
            }
          })
          if (switch_brid == false) {
            this.$message.error("请先选择是否收费");
            this.is_early_bird = false;
          }
          if (value == true && switch_brid == true) {
            let obj = {};
            obj.id = 2;
            obj.label = "早鸟价";
            obj.name = "is_early_bird";
            obj.type = "component";
            obj.value = true;
            obj.icon = "";
            obj.is_commonly = "";
            obj.placeholder = "";
            obj.is_disabled = true;
            obj.is_required = false;
            obj.placeholder = "";
            obj.config_value = "";
            obj.data = {discount: "", period: []};
            this.formData.push(obj);
          } else {
            formData.some((item, index) => {
              if (item.name == name && value == false) {
                this.formData.splice(index, 1);
              }
            });
          }
          break;
        case "is_stay"://关联住宿
          if (value) {
            let obj = {};
            obj.id = 3;
            obj.label = "关联住宿";
            obj.name = "is_stay";
            obj.type = "component";
            obj.value = true;
            obj.icon = "";
            obj.is_commonly = "";
            obj.placeholder = "";
            obj.is_disabled = "";
            obj.is_required = false;
            obj.placeholder = "";
            obj.config_value = "";
            obj.data = [
              {
                dayTime: "",//日期
                nameOne: [],//单间
                nameTwo: [],//标间{roomNum:"",roomPrice:""}
                nameThree: []//拼住
              },
              {
                dayTime: "",
                nameOne: [],
                nameTwo: [],
                nameThree: []
              }
            ];
            this.formData.push(obj);
          } else {
            formData.some((item, index) => {
              if (item.name == name && value == false) {
                this.formData.splice(index, 1);
              }
            });
          }
          break;
        case "is_invoice"://发票
          if (value == true) {
            let obj = {};
            obj.id = 4;
            obj.label = "发票信息";
            obj.name = "is_invoice";
            obj.type = "component";
            obj.value = true;
            obj.icon = "";
            obj.is_commonly = "";
            obj.placeholder = "请填写发票信息";
            obj.is_disabled = true;
            obj.is_required = false;
            obj.placeholder = "";
            obj.config_value = "";
            obj.data = [
              {label: "公司抬头", name: "company_name", type: "input", value: "", is_required: true, is_disabled: true},
              {label: "税号", name: "tax_number", type: "input", value: "", is_required: true, is_disabled: true},
              {label: "企业电话", name: "company_phone", type: "input", value: "", is_required: false, is_disabled: true},
              {label: "开户银行", name: "bank_name", type: "input", value: "", is_required: false, is_disabled: true},
              {label: "银行账户", name: "bank_account", type: "input", value: "", is_required: false, is_disabled: true}
            ]
            this.formData.push(obj);
            console.log(formData)
          } else {
            formData.some((item, index) => {
              if (item.name == name && value == false) {
                this.formData.splice(index, 1);
              }
            });
          }
          break;
        case "is_associated_meeting"://关联会议
          if (value == true) {
            let obj = {};
            obj.id = 5;
            obj.label = "关联会议";
            obj.name = "is_associated_meeting";
            obj.type = "component";
            obj.value = '';
            obj.icon = "";
            obj.is_commonly = "";
            obj.placeholder = "";
            obj.is_disabled = true;
            obj.is_required = false;
            obj.placeholder = "";
            obj.config_value = "";
            obj.data = [
              { id: "1", label: "黄金糕", },
              { id: "2", label: "双皮奶", },
              { id: "3", label: "蚵仔煎", },
              { id: "4", label: "龙须面", },
              { id: "5", label: "北京烤鸭", },
            ];
            this.formData.push(obj);
          } else {
            formData.some((item, index) => {
              if (item.name == name && value == false) {
                this.formData.splice(index, 1);
              }
            });
          }
          break;
        case "signup_num"://报名人数
          if (value == true) {
            let obj = {};
            obj.id = 6;
            obj.label = "报名人数";
            obj.name = "signup_num";
            obj.type = "component";
            obj.value = true;
            obj.icon = "";
            obj.is_commonly = "";
            obj.is_disabled = true;
            obj.is_required = false;
            obj.placeholder = "";
            obj.config_value = 1;
            obj.data = [
              {type: "input", label: "姓名", name: "username", value: "", array: ""},
              {type: "input", label: "手机号", name: "mobile", value: "", array: ""},
              {type: "input", label: "职务", name: "career", value: "", array: ""}
            ]
            this.formData.push(obj);
          } else {
            formData.some((item, index) => {
              if (item.name == name && value == false) {
                this.formData.splice(index, 1);
              }
            });
          }
          break;
      }
    }
  }
}
</script>

<style scoped>

</style>